
<div class="container">
    <div class="subcontainer">
        <header><!-- Defining the header section of the page -->

            <div class="logo"><!-- Defining the logo element -->
                <a href="#">
                    <img src="<?php echo $this->baseUrl() . '/public/template/default/images/logo.png' ?>" title="Mono template" alt="Mono template" />
                </a>
            </div>

            <nav><!-- Defining the navigation menu -->
                <ul>
                    <li class="active"><a href="#">Home</a></li>
                    <li><a href="#">Tutorials</a></li>
                    <li><a href="#">About</a></li>
                    <li><a href="#">To Tutorial</a></li>
                </ul>
            </nav>

            <section id="search"><!-- Search form -->
                <form action="#" onsubmit="return false;" method="get">
                    <input type="text" onfocus="if (this.value == 'Search..')
                            this.value = '';" onblur="if (this.value == '')
                            this.value = 'Search..'" value="Search.." name="q">
                    <input type="submit" value="">
                </form>
            </section>

        </header>
        <div id="main"><!-- Defining the main content section -->

            <section id="slider-wrapper"><!-- Promo slider -->
                <div id="slider" class="nivoSlider">
                    <img style="display: none;" src="<?php echo $this->baseUrl() . '/public/template/default/images/promo1.jpg' ?>" alt="" title="#htmlcaption-1">
                    <img style="display: none;" src="<?php echo $this->baseUrl() . '/public/template/default/images' ?>/promo2.jpg" alt="" title="#htmlcaption-2">
                    <img style="display: none;" src="<?php echo $this->baseUrl() . '/public/template/default/images' ?>/promo3.jpg" alt="" title="#htmlcaption-3">
                </div>
                <div id="htmlcaption-1" class="nivo-html-caption">
                    <h5 class="p2">Your promo text 1</h5>
                    <p>Promo text description here</p> 
                </div>
                <div id="htmlcaption-1" class="nivo-html-caption">
                    <h5 class="p2">Your promo text 2</h5>
                    <p>Promo text description here</p> 
                </div>
                <div id="htmlcaption-2" class="nivo-html-caption">
                    <h5 class="p2">Your promo text 3</h5>
                    <p>Promo text description here</p> 
                </div>
                <div id="htmlcaption-3" class="nivo-html-caption">
                    <h5 class="p2">Your promo text 4</h5>
                    <p>Promo text description here</p> 
                </div>
            </section>

            <section id="promo"><!-- Defining the promo section -->
                <img alt="" src="<?php echo $this->baseUrl() . '/public/template/default/images' ?>/promo.jpg"> Welcome to test our 'Mono' templates. We making best templates for you.
            </section>

            <section id="content"><!-- Defining the featured content section -->
                <ul>
                    <li>
                        <h1>APC caching</h1>
                        <p>Today I have another interesting article for PHP. We will talking about caching, and practice of using caching in php. I will make review of APC caching and will show you how you can use APC in PHP.</p>
                        <a class="more" href="#">Continue +</a>
                    </li>
                    <li>
                        <h1>3D WebGL</h1>
                        <p>Today we continue HTML5 canvas examples. And today we will try to begin learning WebGL. In my demonstration I will show you how to initialize WebGL and draw simple 3D object. Also we will animate this object too.</p>
                        <a class="more" href="#">Continue +</a>
                    </li>
                    <li>
                        <h1>Watermark</h1>
                        <p>Today is interesting tutorial for PHP. I will show you how to use GD library. And, main task today is adding watermark to image and generate result as PNG image into browser. We will using PHP and GD library.</p>
                        <a class="more" href="#">Continue +</a>
                    </li>
                </ul>
            </section>
        </div>
        <div id="submain"><!-- Defining submain content section -->
            <section id="subcontent"><!-- Defining the content section #2 -->
                <div id="left">
                    <ul>
                        <li>
                            <h3>HTML5 & CSS3 single page layout – Art theme</h3>
                            <img alt="" src="<?php echo $this->baseUrl() . '/public/template/default/images' ?>/post.jpg">
                            <p>Today I will like to product new great masterpiece – new template with codename: ‘Art theme’. This will nice HTML5 template with nice gray colors. Hope that you will like new styles and you will learn some new coding lessons.</p>
                            <a class="more" href="#">Continue +</a>
                        </li>
                        <li>
                            <h3>HTML CSS Anime Theme Website Layout</h3>
                            <img alt="" src="<?php echo $this->baseUrl() . '/public/template/default/images' ?>/post.jpg">
                            <p>Today I will like to product new masterpiece – new template with codename: ‘Anime theme’. This will nice HTML5 template with good colors. Hope that you can learn some new coding lessons and download our result and use it at your own site.</p>
                            <a class="more" href="#">Continue +</a>
                        </li>
                    </ul>
                </div>
                <div id="right">
                    <dl id="acc">
                        <dt class="active">
                        <a href="#">Short reviews</a>
                        </dt>
                        <dd class="active" style="display: block;">
                            <p>Here are text of short review of something ...</p>
                            <a class="more" href="#">Continue +</a>
                        </dd>
                        <dt class="">
                        <a href="#">Short reviews #1</a>
                        </dt>
                        <dd style="display: none;">
                            <p>Here are text of short review of something ...</p>
                            <a class="more" href="#">Continue +</a>
                        </dd>
                        <dt>
                        <a href="#">Short reviews #3</a>
                        </dt>
                        <dd>
                            <p>Here are text of short review of something ...</p>
                            <a class="more" href="#">Continue +</a>
                        </dd>
                    </dl>
                </div>
                <div class="clear"></div>
            </section>
        </div>
    </div>  

    <footer> Defining the footer section of the page 
        <ul id="social"> Social profiles links 
            <li><a href="#" title="facebook" rel="external nofollow"><img alt="" src="<?php echo $this->baseUrl() ?>/public/images/facebook.png"></a></li>
            <li><a href="#" title="twitter" rel="external nofollow"><img alt="" src="<?php echo $this->baseUrl() ?>/public/images/twitter.png"></a></li>
            <li><a href="#" title="linkedin" rel="external nofollow"><img alt="" src="<?php echo $this->baseUrl() ?>/public/images/linkedin.png"></a></li>
            <li><a href="#" title="rss" rel="external nofollow"><img alt="" src="<?php echo $this->baseUrl() ?>/public/images/rss.png"></a></li>
        </ul>
        <div id="privacy">
            Mono template © 2011 <a class="link" href="http://www.script-tutorials.com/">Privacy Policy</a><br />
            <a class="link" href="http://www.script-tutorials.com/creating-new-html5css3-single-page-layout-mono/">Template by Script Tutorials</a>
        </div>
    </footer>

</div>